<?php echo view('header.html');?>

<body class="layui-view-body">
    <div class="layui-content">
        <div class="layui-row">

            <div class="layui-card">
                <div class="layui-card-header">
                    <form class="layui-form" id="searchForm">
                        
                        <div class="layui-form-item">
                            <div class="layui-inline">
                                <div class="layui-form-mid">分类名称:</div>
                                <div class="layui-input-inline" style="width: 160px;">
                                    <input type="text" name="name" autocomplete="off" class="layui-input">
                                </div>
                                <div class="layui-form-mid">分类英文名称:</div>
                                <div class="layui-input-inline" style="width: 160px;">
                                    <input type="text" name="enname" autocomplete="off" class="layui-input">
                                </div>
                                <button type="button" class="layui-btn layui-btn-blue" lay-filter="">查询</button>
                                <button type="button" class="layui-btn layui-btn-primary" lay-filter="">重置</button>
                            </div>
                        </div>
                    </form>
                </div>

                <div class="layui-card-body">
                    <table id="listTable" lay-filter="listTable"></table>
                    <script type="text/html" id="toolbarOption">
                    <button type="button" lay-event="del" class="layui-btn layui-btn-danger layui-btn-sm">删除</button>
                    <button type="button" class="layui-btn layui-btn-blue layui-btn-sm" lay-event="addCategory">添加文章分类</button>
                </script>
                    <script type="text/html" id="barOption">
                    <a class="layui-btn layui-btn-xs layui-btn-warm" lay-event="edit">修改</a>
                    <a class="layui-btn layui-btn-xs layui-btn-danger" lay-event="del">删除</a>
                </script>
                </div>
            </div>
        </div>
    </div>

    <?php echo view('footer.html');?>
    <script type="text/javascript">
        layui.use(['layer', 'jquery', 'form', 'table',], function () {
            var layer = layui.layer,
                $ = layui.jquery,
                form = layui.form,
                table = layui.table;

            

            //查询提交
            form.on('submit(search)', function (data) {
                console.log(data);
                tableInit.reload({
                    where: data.field,
                    page: {
                        curr: 1
                    }
                });
            });

            //重置search_reset
            form.on('submit(search_reset)', function (data) {
                $('#search')[0].reset();
                form.render(null, 'search-form');
                tableInit.reload({
                    where: data.field,
                    page: {
                        curr: 1
                    }
                });
            });

            //头工具栏事件
            table.on('toolbar(listTable)', function (obj) {
                var checkStatus = table.checkStatus(obj.config.id);
                var data = checkStatus.data;
                var ids = [];
                $.each(data, function (i, v) {
                    ids.push(v.id);
                })

                switch (obj.event) {

                    case 'del':
                        if (ids.length < 1) {
                            layer.msg('您还没有选择', {
                                icon: 5,
                                anim: 6
                            });
                            return false;
                        }
                        layer.confirm('确定要删除这些？', function (index) {
                            $.post(adminpath + 'admin/article/catdel', {
                                ids: ids
                            }, function (res) {
                                if (res.code == 0) {
                                    layer.msg('操作成功', {
                                        icon: 1,
                                        time: 1500
                                    });
                                } else {
                                    layer.msg(res.msg, {
                                        icon: 5,
                                        anim: 6
                                    });
                                }
                                tableInit.reload();
                            }, 'json');
                            layer.close(index);
                        });
                        break;

                    case 'addCategory':
                        layer.open({
                            type: 2,
                            area: ['600px', '80%'],
                            title: ' 添加文章分类',
                            content: [adminpath + 'admin/article/catadd']
                        });
                        break;

                }
                ;
            });

            //监听行工具事件
            table.on('tool(listTable)', function (obj) {
                var data = obj.data;
                var id = data.id;

                switch (obj.event) {
                    case 'del':
                        layer.confirm('真的要删除吗?', function (index) {
                            $.post(adminpath + "admin/article/catdel", {
                                ids: [id]
                            }, function (res) {
                                if (res.code == 0) {
                                    layer.msg('操作成功', {
                                        icon: 1,
                                        time: 1500
                                    });
                                } else {
                                    layer.msg(res.msg, {
                                        icon: 5,
                                        anim: 6
                                    });
                                }
                                tableInit.reload();
                            }, 'json');
                        });
                        break;

                    case 'edit':
                        layer.open({
                            type: 2,
                            area: ['600px', '80%'],
                            title: '修改分类',
                            content: [adminpath + 'admin/article/catedit?id=' + id]
                        });
                        break;
                }
            });

            var tableInit = table.render({
                elem: '#listTable',
                toolbar: "#toolbarOption",
                defaultToolbar: [],
                title: '菜单列表',
                url: window.location.href,
                method: 'post',
                cols: [
                    [{
                        type: 'checkbox'
                    }, {
                        field: 'id',
                        title: 'catid',
                        width: 80,
                        sort: true
                    }, {
                        field: 'name',
                        title: '分类名称',
                        templet: function (d) {
                            return d.spacer + d.name
                        }
                    }, {
                        field: 'enname',
                        title: '英文名称'
                    }, {
                        field: 'description',
                        title: '简介描述'
                    }, {
                        title: '操作',
                        toolbar: '#barOption'
                    }]
                ],
                page: true,
                response: {
                    statusCode: 0,
                    countName: 'count'
                },
                parseData: function (res) {
                    return {
                        'code': res.code,
                        'data': res.data.data,
                        'count': res.data.total
                    };
                }
            });
        });
    </script>
</body>

</html>
